<template>
  <div class="mlxc">
    <ScrollView :btm-list="data" :is-icon="false"></ScrollView>
  </div>
</template>

<script setup lang="ts">
import ScrollView from '@/views/hbwlpc/componets/SwiperList.vue';
const props = defineProps({
  data: {
    type: Array,
    default() {
      return [];
    }
  }
});
// const list = ref([
//   {
//     name: '1',
//     icon: '1'
//   },
//   {
//     name: '2',
//     icon: '1'
//   },
//   {
//     name: '3',
//     icon: '1'
//   }
// ]);
const getUrl = (img) => {
  return new URL(`../../../../assets/szxc/${img}.png`, import.meta.url).href;
};
</script>

<style lang="scss" scoped>
.mlxc {
  width: 100%;
  height: 100%;
  padding: 0px 10px 10px 20px;
  font-weight: 400;
  font-size: 22px;
  font-family: 'DingTalk';
  color: #cdebff;
  .el-carousel {
    height: 100%;
    :deep(.el-carousel__container) {
      height: 100%;
    }
  }
  .el-carousel__item h3 {
    color: #475669;
    opacity: 0.75;
    height: 100%;
    display: flex;
    width: 50%;
    justify-content: center;
    align-items: center;
    text-align: center;
  }

  .el-carousel__item:nth-child(2n) {
    background-color: #99a9bf;
  }

  .el-carousel__item:nth-child(2n + 1) {
    background-color: #d3dce6;
  }
}
</style>
